<template>
  <div>
    <svg style="width: 50px; height: 50px">
      <use :xlink:href="iconname"></use>
    </svg>
  </div>
</template>

<script setup lang="ts">
import { ref, onMounted } from "vue";

defineOptions({ name: "SvgIcon" });

const iconname = ref("#icon-children");
const props = defineProps({
  name: {
    type: String,
    default: "children",
  },
});
onMounted(() => {
  iconname.value = `#icon-${props.name}`;
});
</script>

<style scoped></style>
